//==================  获取分类 处理下拉框    ==========================

$.ajax({
  url:'/my/category/list',
  success:function(res){
    if(res.status===0){
      let str='';
      res.data.forEach(item => {
        str+=`
        <option value="${item.id}">${item.name}</option>
        `
      });
      $('select[name=cate_id]').append(str);
      // 动态创建的 下拉框 /单项按钮 复选按钮 都需要重新渲染的
      let form=layui.form;
      form.render('select');
    }
  }
});

// ============  使用富文本编辑器  ===========================
initEditor();


//====================   封面图片处理  初始化剪裁框      ===============
let image=$('#image');
let option={
  aspectRatio:400/280,
  preview:'.img-preview'
};
image.cropper(option);


//===========  点击 上传 能够触发文件域的单击事件   ========================================

$('button:contains("选择封面")').on('click',function(){
$('#file').trigger('click')
})

// ===============更换裁剪区的图片====================
$('#file').on('change',function(){
  // console.dir(this)
  if(this.files.length>0){
    // URL.createObjectURL是API的方法
    let url=URL.createObjectURL(this.files[0]);
    console.log(image.cropper());
    image.cropper('replace',url)

  }
})




//=====================上面为处理页面================


$('form').on('submit',function(e){
  e.preventDefault();
  let fd=new FormData(this);
  //单独处理content
  fd.set('content',tinyMCE.activeEditor.getContent());
  let canvas=image.cropper('getCroppedCanvas',{
    width:400,height:280});
    canvas.toBlob(function(blob){
      fd.append('cover_img',blob);
      $.ajax({
        url:'/my/article/add',
        type:'POST',
        data:fd,
        contentType:false,
        processData:false,
        success:function(res){
          if(res.status===0){
            layer.msg(res.message,{time:1500},function(){
              // 跳转到文章列表页
              location.href='./list.html'
            });
          }
        }
      })
    })
})













